<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
      #app{
          background-color: yellow;
          font-size: 55px;
      }
</style>
<body>
    <div id="app" style="background-color: red; margin: 20px;">后盾人</div>
        <script>
          let app = document.getElementById('app')
          //css的样式查询不到，只能查询内置style的内容
  console.log(app.style.backgroundColor)//red
  console.log(app.style.margin)//20px
  console.log(app.style.marginTop)//20px
  console.log(app.style.color)

  //使用winodw.getComputedStyle查询所有的样式,包括css

  console.log(window.getComputedStyle(app).backgroundColor);
  console.log(window.getComputedStyle(app).fontSize);//55px
    </script>
</body>
</html>